import { shapeType } from "src/types/drawBoard";
import Base from "./Base";
import utils from "src/utils";

type darwModel = 'fill' | 'stroke' | 'all'
export interface RectProps {
  x: number;
  y: number;
  width: number;
  height: number;
  borderWidth?: number;
  borderColor?: string;
  bgcolor?: string;
  model?: darwModel
  hollow?: boolean
}

export default class extends Base {
  model:darwModel
  hollow:boolean // 当前为描边时是否包含中间区域（点击边框内是否出发事件）
  constructor(option: RectProps) {
    super(shapeType.rect)
    utils.object.Assign(option, this.props)
    this.model = option.model || 'fill'
    this.hollow = option.hollow || true
  }
  draw(ctx: CanvasRenderingContext2D, osCtx: OffscreenCanvasRenderingContext2D): void {
    const { x, y, width, height } = this.props

    ctx.save()

    this.transform(ctx)

    ctx.beginPath()
    this.initOptions(ctx, 1)
    ctx.rect(x, y, width, height)
    if(this.model == 'all' || this.model == 'fill') ctx.fill()
    if(this.model == 'all' || this.model == 'stroke') ctx.stroke()
    ctx.closePath()

    ctx.restore()

    // 镜像画布
    osCtx.save()

    this.transform(osCtx)

    osCtx.beginPath()
    this.initOptions(osCtx, 2)
    osCtx.rect(x, y, width, height)
    if(this.model == 'all' || this.model == 'fill' || this.hollow) osCtx.fill()
    if(this.model == 'all' || this.model == 'stroke') osCtx.stroke()
    osCtx.fill()
    osCtx.stroke()
    osCtx.closePath()

    osCtx.restore()
  }
}